import 'package:fluent_refresher/fluent_refresher.dart';
import 'package:flutter/material.dart';

class RefresherPage extends StatefulWidget {
  const RefresherPage({super.key});

  @override
  State<RefresherPage> createState() => _RefresherPageState();
}

class _RefresherPageState extends State<RefresherPage> {
  // 创建控制器
  final _controller = RefreshController();
  List<Map<String, dynamic>> _items = [];

  @override
  void initState() {
    super.initState();
    // 初始加载数据
    _items = _generateItems(200);
  }

  // 辅助函数：生成带图片和文本的数据
  List<Map<String, dynamic>> _generateItems(int count, {int offset = 0}) {
    return List.generate(count, (i) {
      final index = i + offset;
      return {
        'id': index,
        'title': '项目标题 ${index + 1}',
        'subtitle': '这是一个关于项目${index + 1}的详细描述内容。',
        // 使用 picsum.photos 获取随机图片，用 id 作为 seed 保证图片稳定
        'imageUrl': 'https://picsum.photos/seed/${index + 1}/200/200',
      };
    });
  }

  // 2. 定义刷新回调
  Future<void> _onRefresh() async {
    // 模拟网络请求
    await Future.delayed(const Duration(milliseconds: 500));
    if (!mounted) return;

    setState(() {
      _items = _generateItems(150);
    });
    // 刷新成功后，重置加载状态，以便可以再次上拉加载
    _controller.refreshCompleted();
  }

  // 定义加载回调
  Future<void> _onLoading() async {
    // 模拟网络请求
    await Future.delayed(const Duration(milliseconds: 500));
    if (!mounted) return;

    final newItems = _generateItems(50, offset: _items.length);
    setState(() {
      _items.addAll(newItems);
    });

    // 使用控制器更新 Footer 状态
    if (newItems.isEmpty || _items.length >= 1000) {
      // 如果没有更多数据了
      _controller.loadNoData();
    } else {
      // 加载成功
      _controller.loadComplete();
    }
  }

  @override
  void dispose() {
    // 5. 销毁控制器
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('fluent_refresher demo')),
      body: FluentRefresher.builder(
        controller: _controller,
        enablePullDown: true,
        enablePullUp: true,
        onRefresh: _onRefresh,
        onLoading: _onLoading,
        headerTriggerDistance: 40.0,
        itemCount: _items.length,
        itemBuilder: (context , index){
          final item = _items[index];
          return _buildCard(item);
        },
      ),
    );
  }


  Widget _buildCard(Map<String, dynamic> item){
    return Card(
      margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
      elevation: 4,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
      child: Padding(
        padding: const EdgeInsets.all(12.0),
        child: Row(
          children: [
            Container(
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(8.0),
              ),
              width: 80,
              height: 80,
              child: Image.network(
                item['imageUrl'],
                width: double.infinity,
                height: double.infinity,
                fit: BoxFit.cover,
                loadingBuilder: (context, child, progress) =>
                progress == null ? child : const Center(child: CircularProgressIndicator()),
                errorBuilder: (context, error, stackTrace) =>
                const Icon(Icons.error, size: 40, color: Colors.red),
              ),
            ),
            const SizedBox(width: 16),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(item['title'], style: Theme.of(context).textTheme.titleMedium),
                  const SizedBox(height: 8),
                  Text(item['subtitle'], style: Theme.of(context).textTheme.bodySmall),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}
